<template>
    <div class="delivery-info w-full!" v-for="i in 1">
        <div class="text-[#666] flex flex-col items-start justify-start">
            <div class="delivery-type text-bold flex-1 w-full! text-[16px] flex flex-col">
                <img src="/transport.png" alt="" srcset="" class="w-5 h-auot sm:w-10 inline-block" v-if="type === 1" />
                <span v-else>Standard</span>
            </div>
            <div class="text-[12px] delivery-type-1 md:text-[14px]!">Epected delkeny</div>
        </div>
        <div class="calendar-container justify-center items-center flex-1">
            <div class="calendar-item">
                <div class="month">Setup</div>
                <div class="day text-7! font-bold my-0">31</div>
            </div>
            <span class="separator">—</span>
            <div class="calendar-item">
                <div class="month">Setup</div>
                <div class="day text-7! font-bold my-0">31</div>
            </div>
        </div>
        <span class="free-shipping">Free</span>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

withDefaults(defineProps<{
    type?: number
}>(), {
    type: 1
})

</script>

<style scoped lang="scss">
@use "./style.scss" as *;
</style>